<template>
  <div class="main">
    <el-form ref="form">
      <el-form-item label="用户">
        <el-input placeholder="请输入用户名" v-model="code"></el-input>
      </el-form-item>
      <el-form-item label="密码" style="">
        <el-input placeholder="请输入密码" v-model="password" type="password"></el-input>
      </el-form-item>
      <el-form-item style="">
        <el-select v-model="optionsM" placeholder="请选择">
            <el-option
                v-for="(item,index) in options"
                :key="item.value"
                :label="item.label"
                :value="index">
            </el-option>
        </el-select>
      </el-form-item>
      <el-row>
        <el-button v-if="optionsM==0" type="primary" round @click="loginStudent()">登录</el-button>
        <el-button v-else type="primary" round @click="loginTeacher()">登录</el-button>
        <el-button  round @click.native="register()">注册</el-button>
      </el-row>
    </el-form>
  </div>
</template>

<script>
import VueCookie from 'vue-cookie';
export default {
  props: {
  },
  components: {
  },
  data() {
    return {
        code:'',
        password:'',
        options: [{
          value: '选项1',
          label: '学生'
        }, {
          value: '选项2',
          label: '老师'
        }],
        optionsM:0,
    };
  },
  computed: {
  },
  watch: {
  },
  created() {
  },
  methods: {
      loginStudent(){
            this.axios.get(`/SCS/student/loginStudent?code=${this.code}&password=${this.password}`,{
                // code:this.code,
                // password:this.password
            }).then(
                response=>{
                    if(this.code!=""&&this.password!=""||response.data!=null){
                      VueCookie.set('name',response.data[0].name)
                        this.$alert(`欢迎${response.data[0].name}同学登录`, '欢迎登陆', {
                            confirmButtonText: '确定',
                        });
                        this.$router.push({
                          name:'home',
                          params:{
                            name:response.data[0].name,
                            code:response.data[0].code,
                            optionsM:this.optionsM
                          }
                        })
                    }else {
                        this.$alert('学号或密码错误或未注册哦,请同学先检查', '警告', {
                            confirmButtonText: '确定',
                        });
                    }
                },
                error=>{
                    console.log('0',error)
                }
            )
        },
        loginTeacher(){
            this.axios.get(`/SCS/teacher/selectTeacher?code=${this.code}&password=${this.password}`,{
                // code:this.code,
                // password:this.password
            }).then(
                response=>{
                    if(response.data[0]!=null){
                      VueCookie.set('name',response.data[0].name)
                        this.$alert(`欢迎${response.data[0].name}老师登录`, '欢迎登陆', {
                            confirmButtonText: '确定',
                        });
                        this.$router.push({
                          name:'home',
                          params:{
                            name:response.data[0].name,
                            code:response.data[0].code,
                            optionsM:this.optionsM
                          }
                        })
                    }else {
                        this.$alert('学号或密码错误或未注册哦,请老师先检查', '警告', {
                            confirmButtonText: '确定',
                        });
                    }
                    
                },
                error=>{
                    console.log('0',error)
                }
            )
        },
        register(){
            this.$router.push({
                name:'register',
                params:{
                  optionsM:this.optionsM
                }
            })
        }
  },
  mounted(){
    this.$bus.$emit('User',this.optionsM)
  }
};
</script>
<style scoped lang="css">
.el-select{
    width: 300px;
    padding-bottom: 20px;
}
.el-form-item{
  text-align: left;
}
  .el-input{
    width: 300px;
  }
  .main{
  text-align: center;
  border-radius: 20px;
	width: 300px;
	height: 350px;
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
  }
  .el-button{
    width: 100px;
  }
</style>